<template>
  <div>
    <div style="width:20%">
      <h3>开考课程</h3>
      <Divider style="height: 2px;margin:15px 0;display: inline-block;" />
    </div>
    <div style="width:80%">
      <h4 style="float: left">开考课程设置：</h4>
      <Button id="b1" @click="exit()">退出</Button>
      <Divider style="height: 2px;margin:15px 0;display: inline-block;" />
      <br><br><br><b id="text" style="font-size: 1rem;"></b><br><br><br><br>
    </div>
    <Table @on-selection-change="selected" size="large" border :columns="columnshead" :data="ListChoice">
      <template slot-scope="{ row,index }" slot="Action1">
        <DatePicker type="date" placeholder="日期" @on-change="ListChoice[index].ecExamdate = $event" transfer></DatePicker>
        <TimePicker type="time" placeholder="开始" @on-change="ListChoice[index].ecStarttime = $event" transfer></TimePicker>
        <TimePicker type="time" placeholder="结束" @on-change="ListChoice[index].ecEndtime = $event" transfer></TimePicker>
      </template>
    </Table>
    <div style="float: right">
      <Page :total="total" :current="1" show-elevator show-total @on-change="changePage"></Page>
    </div>
    <br><br><Button type="primary" @click="handleSubmit('ListChoice')">保存提交</Button>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        columnshead: [{
            title: '课程编码',
            key: 'csId',
            width: 100
          },
          {
            title: '国家课程代码',
            key: 'ncId',
            width: 100
          },
          {
            title: '课程名称',
            key: 'csName',
            width: 150
          },
          {
            title: '课程说明',
            key: 'csIntro',
            width: 150
          },
          {
            title: '教材国际书号',
            key: 'tbIsbn',
            width: 150
          },
          {
            title: '学分',
            key: 'csCredit',
            width: 70
          },
          {
            title: '课程性质',
            key: 'csProperties',
            width: 150
          },
          {
            title: '备注',
            key: 'csRemark',
            width: 150
          },
          {
            title: '时间设置',
            slot: 'Action1',
            width: 150
          },
          {
            type: 'selection',
            width: 60,
            align: 'center'
          }
          // {
          //   title: '是否选择',
          //   slot: 'Action2'
          // }
        ],
        esId: '0',
        mvId: '',
        CourseList: [],
        ListChoice: [],
        CoueseExam: [],
        newCE: [],
        updateCE: [],
        deleteCE: [],
        nf: 0,
        uf: 0,
        df: 0,
        tempList: [],
        total: 1
      }
    },
    created() {
      this.getParams()
      this.$axios.get(this.$host + '/course/management/allCourses?pageNum=1&&pageSize=100').then(res => {
        console.log(res)
        this.CourseList = res.data.data.list
        this.$axios.get(this.$host + '/examination/plan/allExamCourseByExamSessionId?esId=' + this.esId +
          '&&pageNum=1&&pageSize=100').then(res => {
          this.tempList = res.data.data.list
          for (var i = 0; i < this.CourseList.length; i++) {
            var j = this.CourseList[i]
            //console.log(1)
            if (j.mvId == this.mvId) {
              j.esId = this.esId
              j.ecExamdate = new Date('1997-9-7')
              j.ecStarttime = ''
              j.ecEndtime = ''
              j.ecTimecode = j.ecExamdate.toString()
              j._checked = false
              this.ListChoice.push(j)
            }
          }
          for (var i = 0; i < this.ListChoice.length; i++) {
            for (var j = 0; j < this.tempList.length; j++) {
              if (this.ListChoice[i].csId == this.tempList[j].csId) {
                this.ListChoice[i]._checked = true
                this.ListChoice[i].ecExamdate = this.tempList[j].ecExamdate
                this.ListChoice[i].ecStarttime = this.tempList[j].ecStarttime
                this.ListChoice[i].ecEndtime = this.tempList[j].ecEndtime
                this.ListChoice[i].ecTimecode = this.ListChoice[i].ecExamdate.toString()
              }
            }
          }
        })
        document.getElementById("text").innerHTML = "考次编码：" + this.esId
      })
    },
    watch: {
      '$route': 'getParams'
    },
    methods: {
      getParams() {
        this.esId = this.$route.query.esId
        this.mvId = this.$route.query.mvId
      },
      selected(selection) {
        for (var i in selection) {
          this.CoueseExam.push({
            esId: this.esId,
            csId: selection[i].csId
          })
          /* if (this.ListChoice[i].isChoose == true) {
            var j = this.ListChoice[i]
            selection[i].examSessionId = this.CoueseExam[i].examSessionId
            .courseId = this.ListChoice[i].csId
            j.examDate = this.ListChoice[i].examDate
            j.startTime = this.ListChoice[i].startTime
            j.endTime = this.ListChoice[i].endTime
            j.timeCode = this.ListChoice[i].examDate + this.ListChoice[i].startTime + this.ListChoice[i].endTime
            this.CoueseExam.push(j)
          } */
        }
      },
      handleSubmit(name) {
        if (this.CoueseExam.length == 0) {
          this.$Message.error('请至少选择一项，再保存！')
        } else {
          console.log(this.CoueseExam)
          console.log(this.ListChoice)
          for (var i = 0; i < this.ListChoice.length; i++) {
            for (var j = 0; j < this.CoueseExam.length; j++) {
              if (this.CoueseExam[j].csId == this.ListChoice[i].csId) {
                if (this.ListChoice[i]._checked == true) {
                  var k = {}
                  k.csId = this.ListChoice[i].csId
                  k.esId = this.ListChoice[i].esId
                  k.ecExamdate = this.ListChoice[i].ecExamdate
                  k.ecStarttime = this.ListChoice[i].ecStarttime
                  k.ecEndtime = this.ListChoice[i].ecEndtime
                  k.ecTimecode = this.ListChoice[i].ecTimecode.slice(11,15)
                  this.updateCE.push(k)
                  this.uf = 1
                } else if (this.ListChoice[i]._checked == false) {
                  var k = {}
                  k.csId = this.ListChoice[i].csId
                  k.esId = this.ListChoice[i].esId
                  k.ecExamdate = this.ListChoice[i].ecExamdate
                  k.ecStarttime = this.ListChoice[i].ecStarttime
                  k.ecEndtime = this.ListChoice[i].ecEndtime
                  k.ecTimecode = this.ListChoice[i].ecTimecode.slice(11,15)
                  this.newCE.push(k)
                  this.nf = 1
                }
              } else if (this.ListChoice[i]._checked == true) {
                var k = {}
                k.csId = this.ListChoice[i].csId
                k.esId = this.ListChoice[i].esId
                k.ecExamdate = this.ListChoice[i].ecExamdate
                k.ecStarttime = this.ListChoice[i].ecStarttime
                k.ecEndtime = this.ListChoice[i].ecEndtime
                k.ecTimecode = this.ListChoice[i].ecTimecode.slice(11,15)
                  this.deleteCE.push(k)
                  this.df = 1
              }
            }
          }
          console.log(this.newCE[0])
          if (this.nf == 1) {
            this.$axios.post(this.$host + '/examination/plan/newExamCourses', {
              jsonArray: this.newCE
            }).then(res => {
              if (res.data.message == '新增开考课程列表成功') {
                console.log(1)
              }
            })
          }
          if (this.uf == 1) {
            this.$axios.post(this.$host + '/examination/plan/examTimeOfCourse', {
              jsonArray: this.updateCE
            }).then(res => {
              if (res.data.message == '设置考试日期和时间成功') {
                console.log(2)
              }
            })
          }
          if (this.df == 1) {
            this.$axios.post(this.$host + '/examination/plan/examCourses', {
              jsonArray: this.deleteCE
            }).then(res => {
              if (res.data.message == '删除开考课程列表成功') {
                console.log(3)
              }
            })
          }
          this.$Message.success('设置开考课程成功!');
           this.$router.push({
             name: 'ExamSessionWithoutCourse'
           })
        }
      },
      changePage(currentPage) {
        this.$axios.get(this.$host + '/examination/management/allExamsession?pageNum=' + currentPage +
          '&&pageSize=10').then(res => {
          this.ExaminationList = res.data.data.list
        })
      },
      exit() {
        this.$router.push({
          name: 'ExamSessionWithoutCourse'
        })
      }
    }
  }
</script>

<style scoped>
  h3 {
    font-size: 1.75rem;
    float: left;
  }

  #b1 {
    float: right;
    background-color: burlywood;
  }
</style>
